<!-- 我的表格 -->

<template>
  <WebTable>
    <RowCheckbox v-if="!isHistory" />
    <RowIndex />
    <RowTime :label="`${CORE.MAP.ALARM}时间`" bind="alarmTime" width="auto" />
    <RowStatus :label="`${CORE.MAP.ALARM}等级`" bind="alarmLevelId" :dict="GETTER.ALARM_LEVEL" width="auto" />
    <RowText :label="`${CORE.MAP.ASSET}名称`" bind="alarmResName" :minWidth="100" />
    <RowTree :label="CORE.MAP.REGION" bind="areaId" :dict="CORE.REGION.DICT" allName :minWidth="120" />

    <RowTree :label="`${CORE.MAP.ALARM}分组`" bind="subSystemId, subSystemName" :dict="$root.alarm_group_treeDict" />
    <RowTree :label="`${CORE.MAP.ALARM}名称`" bind="alarmTypeId, alarmTypeName" :dict="$root.alarm_group_treeDict" />
    <RowDict :label="`${CORE.MAP.ALARM}类型`" bind="alarmDictId, alarmDictName" :dict="CORE.DICT.alarm_type" />

    <RowStatus label="处理状态" bind="alarmResolveState" :dict="GETTER.DEAL_STATUS" width="auto" />
    <RowDict v-if="isHistory" label="处理方式" bind="dealType" :dict="GETTER.DEAL_TYPE" :width="100" />

    <RowOperate :width="isHistory ? 100 : 140">
      <template #default="{ row }">
        <BtnText title="查看" @click="windowDetail(row)" />
        <el-dropdown v-if="!isHistory" @command="(type) => openDeal(row, type)">
          <BtnText><span>处理</span><i class="el-icon-caret-bottom" /></BtnText>
          <template #dropdown>
            <el-dropdown-menu class="AlarmList-MyTable-dropdown">
              <el-dropdown-item v-for="[id, name] in btnDict" :key="id" :command="id">{{ name }}</el-dropdown-item>
            </el-dropdown-menu>
          </template>
        </el-dropdown>
      </template>
    </RowOperate>
  </WebTable>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'
import mixDetailToTable from '@admin/components/detail/mixDetailToTable'
import AlarmFooter from '@admin/components/detail/DetailAlarm/AlarmFooter'
import props from './props'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'MyTable',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [
    mixDetailToTable('', 'DetailAlarm'),
    CORE.mixWeb('deal', 'deal_'),
  ],

  /**
   * 属性注册 (抽取以便查阅)
   */
  props,

  /**
   * 计算属性 (慎用箭头函数)
   */
  computed: AlarmFooter.computed,

  /**
   * 监听属性 (深度 deep 首次 immediate)
   */
  watch: {
    /**
     * 监听处理的修改就绪
     */
    deal_readyEdit(ready) {
      ready && this.refreshList()
    },
  },

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: AlarmFooter.methods,
}
</script>
